<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>

<head>
<meta charset="utf-8" />
<title>OPPO官网</title>
<meta charset="UTF-8">
<link rel="stylesheet" type="text/css" href="static/css/index.css" /></link>

<link rel="stylesheet" href="static/css/carts.css">
<link rel="stylesheet" href="static/css/reset.css">
<meta name="viewport"
	content="width=device-width, initial-scale=1, user-scalable=yes">
</head>
	<style>
		#nonelist li{
			text-align: center;
		}
		#nonelist{
			position: absolute; 
			width: 100px;
			height: 80px;
			top: 0px;
			right: 40px; 
			z-index: 4;z
			display: block;
			border-radius: 10px;
			background-color: white;
		}
		#nonelist li a{
			font-size: 8px;
			text-decoration: none;
			color: #45494C;
		}
		#nonelist li a:hover{
			color: green;
		}
	</style>
<body>
	<div id="index">
		<div id="log">
			<a href="index.jsp"><img src="static/img/oppo.png"></img></a>
		</div>
		<div class="bann">
			<ul>
				<li class="yin"><a class="zi" id="zx" href="##">手机</a></li>
				<li><a class="zi" href="##">品牌</a></li>
				<li><a class="zi" href="##">商场</a></li>
				<li><a class="zi" href="##">体验店</a></li>
				<li><a class="zi" href="##">服务</a></li>
				<li><a class="zi" href="##">社区</a></li>
				<li><a class="zi" href="##">ColorOs</a></li>
				<li><a class="zi" href="##">云服务</a></li>
			</ul>
		</div>
		<div class="buttonCollection">
			<div class="qutton" id="qutton_upload">
				<div class="qutton_dialog" id="uploadDialog">
					<ul>
						<li><a href="CartItem.jsp" class="zi"><img src="static/img/购物车.png"></img>购物车</a>
						</li>
						<li><a href="##" class="zi"><img src="static/img/订单.png">我的订单</a>
						</li>
						<li><a href="##" class="zi"><img src="static/img/回收单.png">回收单</a>
						</li>
						<li><a href="##" class="zi"><img
								src="static/img/个人中心.png">个人中心</a></li>
						<li><a href="login.html" class="zi"><img src="static/img/登陆.png">登陆</a>
						</li>
					</ul>
				</div>
			</div>
		</div>

	</div>
	<div id="xian">
		<div class="x1">
			<img src="static//img/R17.png">
		</div>
		<div class="x2">
			<img src="static/img/R17pro.png"> <img
				src="static/img/findx.jpg"> <img src="static/img/R15.png">
			<img src="static/img/A7X.png">
		</div>
		<div class="x3">
			<img src="static/img/A1.png"> <img src="static/img/A3.png">
			<img src="static/img/A5.png"> <img src="static/img/R11S.png">
		</div>
	</div>
	<div id="out-1">
		<div id="gou">
			<div id="gou2" style="height:700px">
				<img src="static/img/shp-empty-45cde114bb.png">
				<p>你的购物车还是空的，快去逛逛吧 。</p>
				<div id="an4">
					<a href="index.jsp">带我去购物车</a>
				</div>
			</div>
		</div>
	</div>
	<div id="lian">
		<ul>
			<li id="t1">推荐机型
				<ul>
					<li>R17</li>
					<li>FIND X</li>
					<li>A7</li>
					<li>A7X</li>
					<li>A9</li>
					<li>A11</li>
				</ul>
			</li>
			<li id="t2">服务
				<ul>
					<li>以旧换新</li>
					<li>服务网点查询</li>
					<li>零配件查询</li>
					<li>官方授权网点</li>
					<li>预置软件公告</li>
				</ul>
			</li>
			<li id="t3">关于我们
				<ul>
					<li>关于OPPO</li>
					<li>新闻资讯</li>
					<li>媒体联络</li>
					<li>加入我们</li>
					<li>反馈安全问题</li>
				</ul>
			</li>
			<li id="t4">商务合作
				<ul>
					<li>开放平台</li>
					<li>材料合作</li>
				</ul>
			</li>
			
		</ul>
	</div>
	<div id="di">© 2005 - 2018 OPPO 版权所有 粤ICP备08130115号-1
		联系方式：4001-666-888</div>
	<script src='http://www.5iweb.com.cn/statics/js/jquery.1.7.1.min.js'></script>
	<script src="static/js/lib/velocity.js"></script>
	<script src="static/js/lib/velocity.ui.js" type="text/javascript"></script>
	<script src="static/js/lib/Quttons.js" type="text/javascript"></script>
	<script type="text/javascript" src="static/js/main.js"></script>
	<script type="text/javascript"></script>
	
	<script>
	$(document).ready(function() {
		var user_id=<%=request.getSession().getAttribute("user_id")%>;
		if(user_id != "" && user_id != null){
			$.ajax({
				url:"FindImgControl",
                type:"post",
                data:{"user_id":user_id},
                dataType : "json",
                success:function(data){
                	var strHtml = "";
    				$.each(data, function(index, eachVal) {
    					strHtml+="<img src='";
    					strHtml+=eachVal.user_img;
    					strHtml+="'style='height: 40px; width: 40px; border-radius: 20px; margin-top:20px'/>";
    					strHtml+="<div id='nonelist'>";
	    					strHtml+="<ul style='list-style: none;'>";
		    					strHtml+="<li><a href='UserSe.jsp'>个人中心</a></li>";
		    					strHtml+="<li><a href='CartItem.jsp'>我的购物车</a></li>";
		    					strHtml+="<li><a href='Order.jsp'>我的订单</a></li>";
		    					strHtml+="<li><a href='ExitControl'>注销</a></li>";
	    					strHtml+="</ul>"
    					strHtml+="</div>";
    					
    				});
    				$(".buttonCollection").html(strHtml);
                }
			})	
		}
		$.ajax({				
			url:"CarAction",
            type:"post",
            data:{"user_id":user_id},
            dataType : "json",
            success:function(data){
            	if(data!=""&&data!=null){
            	console.log(data);
            	var strHtml = "";
            	
            	
            	strHtml+="<form action='PaySkipAction' id= 'f11'>";
            	strHtml+="<section class='cartMain'>";


				strHtml+="<div class='cartMain_hd'>";	
				strHtml+="<ul class='order_lists cartTop'>";	
				strHtml+="<li class='list_chk'>";		
								<!--所有商品全选-->
				strHtml+="<input type='checkbox' id='all' class='whole_check'>";			
				strHtml+="<label for='all'>";
				
				strHtml+="</label> 全选";				
				strHtml+="</li>";			
				strHtml+="<li class='list_con'>商品信息</li>";            
				strHtml+="<li class='list_info'>商品参数</li>";			
				strHtml+="<li class='list_price'>单价</li>";			
				strHtml+="<li class='list_amount'>数量</li>";			
				strHtml+="<li class='list_sum'>金额</li>";			
				strHtml+="<li class='list_op'>操作</li>";			
				strHtml+="</ul>";		
				strHtml+="</div>";	
				strHtml+=" <div class='cartBox'>";   
				strHtml+="<div class='order_content'>";
            	// form 
				$.each(data, function(index, eachVal) {
			
					strHtml+="<ul class='order_lists'>";			
					strHtml+="<li class='list_chk'>";				
					strHtml+="<input type='checkbox' name='productcheck' value='";
					strHtml+=eachVal.car_id;
					strHtml+="'  id='checkbox_";
					strHtml+=eachVal.car_id;
					strHtml+="' class='son_check' >";					
					strHtml+="<label for='checkbox_";
						strHtml+=eachVal.car_id;
					strHtml+="'>";
					strHtml+="</label>";					
					strHtml+="</li>";				
					strHtml+="<li class='list_con'>";				
					strHtml+="<div class='list_img'>";					
					strHtml+="<a href='javascript:;'>";
					strHtml+="<img src='./images/1.png' alt=''>";
					strHtml+="</a>";
					strHtml+="</div>";					
					strHtml+="<div class='list_text'>";					
					strHtml+="<a href='javascript:;'><img src='";
						strHtml+=eachVal.product_img;
					strHtml+="'></a>";	
									
					strHtml+="</div>";					
					strHtml+="</li>";				
					strHtml+="<li class='list_info'>";				
					strHtml+="<p>型号规格：";
						strHtml+=eachVal.product_model;
						strHtml+="</p>";					
					strHtml+="<p>颜色：";
					strHtml+=eachVal.product_color;
					strHtml+="</p>";					
					strHtml+="</li>";				
					strHtml+="<li class='list_price'>";				
					strHtml+="<p class='price'>￥"
						strHtml+=eachVal.product_price;
					strHtml+="</p>";					
					strHtml+="</li>";				
					strHtml+="<li class='list_amount'>";				
					strHtml+="<div class='amount_box'>";					
					strHtml+="<a href='javascript:;' class='reduce reSty'>-</a>";						
					strHtml+="<input type='text' value='";
						strHtml+=eachVal.product_count;
					strHtml+="' class='sum'>";						
					strHtml+="<a href='javascript:;' class='plus'>+</a>";						
					strHtml+="</div>";					
					strHtml+="</li>";				
					strHtml+="<li class='list_sum'>";				
					strHtml+="<p class='sum_price'>￥";
					strHtml+=eachVal.product_allprice;
					strHtml+="</p>";					
					strHtml+="</li>";				
					strHtml+="<li class='list_op'>";				
					strHtml+="<p class='del'>";					
					strHtml+="<a href='##' class='delBtn' onclick='Delect(";
					strHtml+=eachVal.car_id;
					
					strHtml+=")'>移除商品</a>";						
					strHtml+="</p>";					
					strHtml+="</li>";				
					strHtml+="</ul>";	
					
					strHtml+="<section class='model_bg'></section>";
					strHtml+="<section class='my_model'>";
					strHtml+="<p class='title'>删除宝贝<span class='closeModel'>X</span></p>";	
					strHtml+="<p>已成功删除</p>";	
					strHtml+="<div class='opBtn'>";	
					strHtml+="<a href='javascript:;' class='dialog-sure'>确定</a>";		
					
					strHtml+="</div>";	
					strHtml+="</section>";
	
				});

				strHtml+="</div>";		
				strHtml+="</div>";	


					<!--底部-->
				strHtml+="<div class='bar-wrapper'>";	
				strHtml+="<div class='bar-right'>";		
				strHtml+="<div class='piece'>已选商品<strong class='piece_num'>0</strong>件</div>";		
				strHtml+="<div class='totalMoney'>共计: <strong class='total_text'>0.00</strong></div>";
				strHtml+="<input type='hidden' value = '0' id = 'allprice' name ='allprice'>";
				strHtml+="<div class='calBtn'>";			
				strHtml+="<a href='javascript:;'  onclick='MySubmit()'>结算</a>";				
				strHtml+="</div>";			
				strHtml+="</div>";		
				strHtml+="</div>";
				
				strHtml+="</section>";
				strHtml+="</form>";
				
				
				strHtml+="<script src='static/js/carts.js'>";
				
				$("#gou").html(strHtml);
				}
				
            }
		})
			
	})
	function Delect(a) {
			console.info("a="+a);
				$.ajax({
					url:"CarDelectAction",
	                type:"post",
	                data:{"a":a},
	                dataType : "json",
	                sucess:function(data){
	                	console.info("a="+data);
	                }
				});
			}
	function MySubmit(){
		$("#allprice").val($(".total_text").html());
		$("#f11").submit();
	}
		
	
		</script>
	
</body>

</html>